<template>
<view class="container">
	<uni-list :border="false">
		<message-card v-for="item in list"
			:key="item.id"
			:item="item"
			@on-item="() => onItemClick('message', 'message', item)">
		</message-card>
	</uni-list>
	<view v-show="showText" class="empty-text sec-top">{{ text }}</view>
</view>
</template>

<script>
import MessageCard from '../tabbar/message-card.vue';
import { getNotifications } from '@/api/index.js';
export default {
	components: {
		MessageCard
	},
	data() {
		return {
			list: [],
			limit: 20,
			offset: 0,
			showText: false,
			text: '加载中...',
			noMore: false
		}
	},
	onShow() {
		const token = uni.getStorageSync('X-Auth-Token');
		if (!token) {
			uni.navigateTo({
				url: '/pages/login/login'
			});
		}
		this.reset();
		this.getList(this.offset, this.limit);
	},
	methods: {
		reset() {
			this.list = [];
			this.offset = 0;
			this.limit = 20;
			this.noMore = false;
			this.showText = false;
			this.text = '加载中...';
		},
		getList(offset, limit) {
			this.showText = true;
			getNotifications({
				offset: offset,
				limit: limit
			}).then(res => {
				let total = res.total || 0;
				if (total <= (offset + 1) * limit) {
					this.noMore = true;
					this.text = '已经到底啦～';
				}
				this.list = this.list.concat(res.list || []).map(item => {
					return {
						id: item.id,
						title: '系统通知',
						summary: item.content
					}
				});
			});
		},
		onItemClick(module, type, item) {
			uni.navigateTo({
				url: `/pages/${ module }/detail?id=${ item.id }&from=task`
			})
		}
	},
	// 下拉刷新
	onReachBottom() {
		if (!this.noMore) {
			this.offset = this.offset + 1;
			this.getList(this.offset, this.limit);
		}
	}
}
</script>
